<template>
    <div class="limiter">
        <div class="container-login100" style="background-image: url('/assets/images/img-01.jpg');">
            <div class="wrap-login100 p-t-190 p-b-30">
                <van-form @submit="onSubmit" class="login100-form validate-form">
                    <div class="login100-form-avatar">
                        <img src="/assets/images/avatar-01.jpg" alt="AVATAR">
                    </div>

                    <span class="login100-form-title p-t-20 p-b-45">Hello</span>

                    <div class="wrap-input100 validate-input m-b-10" data-validate="请输入用户名">
                        <van-field v-model="mobile" name="mobile" label="手机号码" placeholder="请输入手机号码"
                            :rules="[{ required: true, message: '请填写手机号码' }]">
                            <template #left-icon>
                                <van-icon name="phone" color="#999999" />
                            </template>
                        </van-field>
                    </div>

                    <div class="wrap-input100 validate-input m-b-10" data-validate="请输入密码">
                        <van-field v-model="password" type="password" name="password" label="密码" placeholder="密码"
                            :rules="[{ required: true, message: '请填写密码' }]">
                            <template #left-icon>
                                <van-icon name="lock" color="#999999" />
                            </template>
                        </van-field>
                    </div>

                    <div class="container-login100-form-btn p-t-10">
                        <van-button color="linear-gradient(to right, #87fcbf, #07c160)" style="width: 100%;" round
                            native-type="submit">登
                            录</van-button>
                    </div>

                    <div class="text-center w-full p-t-25 p-b-230">
                    </div>

                    <div class="text-center w-full">
                        <router-link to="/business/register" class="txt1">
                            立即注册
                            <i class="fa fa-long-arrow-right"></i>
                        </router-link>
                    </div>
                </van-form>
            </div>
        </div>
    </div>
</template>
<script setup>
const mobile = ref('')
const password = ref('')
const { proxy } = getCurrentInstance()
const onSubmit = async (values) => {
    let result = await Api.login(values)
    if (result.code == 1) {
        //存储用户信息
        proxy.$cookies.set("LoginUser", result.data);
        success({
            message: result.msg,
            onClose: () => {
                proxy.$router.push('/business/index')
            }
        });
    } else {
        error(result.msg);
    }
};
</script>
<style>
@import url('/assets/fonts/font-awesome-4.7.0/css/font-awesome.min.css');
@import url('/assets/css/util.css');
@import url('/assets/css/main.css');
</style>